// components/spu-preview/index.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    data: Object
  },

  /**
   * 组件的初始数据
   */
  data: {
    tags: []
  },

  observers: {
    data: function (data) {
      // 即便data出现于 数据对象或者{} 这两者中，但也考虑下 undefined和null，进行代码冗余
      if (!data) {
        return
      }
      if (!data.tags) {
        return
      }
      const tags = data.tags.split('$')
      this.setData({
        tags
      })
    }
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onImgLoad(event) {
      const {width, height} = event.detail
      const h = 340*height / width
      this.setData({
        w: 340,
        h: h
      })
    },
    onItemTap(event) {
      const pid = event.currentTarget.dataset.pid
      // 通用性组件：lin-ui算是这类组件，目的是为开发者服务，避免开发者重复造轮子
      // 业务性组件可以适当降低组件通用性，加快开发效率
      wx.navigateTo({  //降低了组件通用性，好处是易用，特定复用强（该组件复用，这些组件对象都会跳转到详情页）
        url: `/pages/detail/detail?pid=${pid}`
      })
    }
  }
})
